import React, { useState } from 'react';
import { View, Text, StyleSheet } from 'react-native';
import { Picker } from '@react-native-picker/picker';
/*
* 下拉列表组件
* */
export default function FilePicker() {
    const [selectedValue, setSelectedValue] = useState('java');

    return (
        <View style={styles.container}>
            <Text style={styles.title}>选择编程语言：</Text>
            <Picker
                selectedValue={selectedValue}
                onValueChange={(itemValue, itemIndex) => setSelectedValue(itemValue)}
                style={styles.picker}>
                <Picker.Item label="Java" value="java" />
                <Picker.Item label="JavaScript" value="js" />
                <Picker.Item label="Python" value="python" />
                {/* 更多选项... */}
            </Picker>
            <Text style={styles.result}>你选择了：{selectedValue}</Text>
        </View>
    );
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        justifyContent: 'center',
        paddingHorizontal: 20,
    },
    title: {
        fontSize: 20,
        fontWeight: 'bold',
        marginBottom: 10,
    },
    picker: {
        height: 50,
        borderColor: 'gray',
        borderWidth: 1,
        marginBottom: 10,
    },
    result: {
        fontSize: 18,
    },
});